<template>
    <canvas id="canvas"></canvas>
</template>



<script setup lang="ts">
  import {onMounted} from "vue";
  import RenderContext from "@/views/cg/lib/RenderContext.ts";
  import {Model, shape} from '../lib'
  onMounted(()=>{

   /*
    let canvas = document.getElementById('canvas')

    let gl = canvas.getContext('webgl')
    console.log('canvas',canvas)
    console.log('gl',gl)
        if(!gl){
      throw 'gl initialize fail'
    }

    */



    let gl = RenderContext.getGL()
    let program = RenderContext.getProgram()
    console.log(gl, program);

    const mesh = shape.d2_f(100, 100, 100, 150, 30)
    const model = new Model(mesh)
    model.setVectorUniform("u_color", [
      Math.random(),
      Math.random(),
      Math.random(),
      1.0
    ])
    model.setVectorUniform('u_resolution',[
        gl.canvas.width,
        gl.canvas.height
    ])

    model.draw()
  })
</script>

<style scoped lang="scss">
#canvas{
  width: 100%;
  height: 100%;
  display: block;
}
</style>